import React, { Component } from 'react';
import { connect } from 'react-redux'  
import moment from 'moment'
import { Modal, Form, Input,Select ,Table,Button,Row,Col,} from 'antd';

const FormItem = Form.Item;
const Option = Select.Option;
var _props;

class PatrolListModal extends Component {
  constructor(props) {
    super(props);
  }

  //查看巡检结果
  viewResult(id){
    const { viewResult } =  _props;
     viewResult(id);
  }
  
  render() {
    const { children, dispatch,patrolList,currentSize,confirmLoading,inspectPlanId,current,total } = this.props;
    _props = this.props; 
    const { getFieldDecorator } = this.props.form;
    const formItemLayout = {
      labelCol: { span: 10 },
      wrapperCol: { span: 12 },
    }; 
   
    const paginationDetail = {
        current:current,
        pageSize:currentSize,
        total: total,
        showSizeChanger: true,
        showTotal: (total => '共' + total + '条'),
        onShowSizeChange(current, size) {
            dispatch({
                type: 'patrolPlan/getPatrolList',
                payload: {...{'pageNum':current,'inspectPlanId':inspectPlanId, 'pageSize':size} },
            });
        },
        onChange(current) {
            dispatch({ 
                type: 'patrolPlan/getPatrolList', 
                payload: { ...{'pageNum':current,'inspectPlanId':inspectPlanId, 'pageSize':currentSize} },
            });
        },
    };


    const columns = [{
        title: '巡检名称',
        dataIndex: 'name',
        key: 'name',
        width: 350
      },{
        title: '巡检时间',
        dataIndex: 'inspectDate',
        key: 'inspectDate',
        width: 350,
        render: (value, row, index) => {
            return (
              value?new moment(value).format("YYYY-MM-DD")+" "+row.beginTime+"-"+row.endTime:''
            )
        }
      },{
        title: '巡检状态',
        dataIndex: 'status',
        key: 'status',
        width: 350,
        render: (value, row, index) => {
            return (
                value==1?"未开始":value==2?"执行中":value==3?"已完成":value==4?"已超时":""
            )
        }
      },{
        title: '巡检详情',
        dataIndex: 'operation',
        key: 'operation',
        width: 300,
        render: (text, record) => (
            <span>               
               <a onClick={this.viewResult.bind(null, record.id_)}>查看详情</a>     
            </span>
        ),
      }];  
   
    return (
      <span>
        <Modal           
                maskClosable= {this.props.maskClosable}
                confirmLoading= {this.props.confirmLoading}
                title={this.props.title}
                width={1000}
                visible={this.props.visible}
                footer={[
                  <Button  key="close" type="primary" size="large" onClick={this.props.onCancel}>关闭</Button>
                ]}
                onCancel={this.props.onCancel}
                key={this.props.newKey}
        >
         <div style={{width:'auto',height:document.body.clientHeight - 260,position:'relative',backgroundColor:'#fff'}}>
            <div style={{minHeight:'100%'}}>                

              <div style={{minHeight:'100%'}}>
                <div style={{width:'100%',height:'100%',paddingLeft:'20px',paddingRight:'20px'}}>
                      <Table columns={columns}
                          rowKey={record => record.id_}                  
                          dataSource={patrolList} 
                          loading={confirmLoading}
                          pagination={paginationDetail} 
                          scroll={{ y: document.body.clientHeight - 330}}
                    />
                </div>
              </div>
          </div>          
        </div>
        </Modal>
        
      </span>
    );
  }
    
}

export default Form.create()(PatrolListModal)
